import { login, getUserInfo, getUserInfoById } from '@/api/user'
// 1.引入cookie的方法
import { getToken, setToken, removeToken } from '@/utils/auth'
export default {
  // 命名空间， 值为true表示当前的模块中的
  // mutations和actions中的函数都是具有独立作用域的函数
  // 具有命名空间的函数必须通过模块名进行调用
  // 语法：this.dispatch('模块名/函数名',参数)
  namespaced: true,
  state: {
    // 声明变量保存token
    // 3.token初始值从缓存中获取,利用cookie实现数据持久化
    token: getToken(),
    // 声明变量保存用户信息
    userInfo: {}
  },
  // mutations只能写同步代码
  mutations: {
    // 声明函数设置token的值
    // mutations中的函数默认接收的第一个参数一定是state
    // 这个state指的就是当前模块的state
    SET_TOKEN(state, token) {
      state.token = token
      // 2.保存token到本地缓存
      setToken(token)
      // 保存登录的时间戳
      // Date.now()是原生js中获取当前时间戳的方法
      localStorage.setItem('loginTime', Date.now())
    },
    // 保存用户信息
    setUserInfo(state, data) {
      state.userInfo = data
    },
    // 清除token
    removeToken(state) {
      state.token = null
      removeToken()
    },
    // 清除用户信息
    removeUserInfo(state) {
      state.userInfo = {}
    }
  },
  actions: {
    /**
     * 为何要再这里调用登录接口？
     * 答：为了后期维护方便，所以一般情况会把所有的登录的逻辑统一封装在vuex中。
     *
     * actions是vuex提供的专门用来调用异步代码的属性
     * actions中声明的函数，默认接收到的第一个参数一定是store（context）,
     * 这个store参数相当于实例化的Vuex.Store对象。
     *
     * 调用actions中的函数必须使用下面语法实现：
     * this.$store.dispatch('函数名',参数)
     *
     * */
    // 调用接口。获取token
    async login(store, data) {
      // login(data).then(res => {
      //   // console.log(18, res)
      //   // commit是vuex提供专门用于调用mutations函数的方法
      //   // store相当于我们在vue文件中使用this.$store
      //   store.commit('SET_TOKEN', res.data.data)
      // })
      const res = await login(data)
      // 在响应拦截器添加了优化,所以这里不用再写 res.data.data
      store.commit('SET_TOKEN', res)
    },
    // 调用获取用户信息接口
    async getUserInfo(store) {
      // 因为我们这里获取到的是当前等着的信息
      // 整个项目中的任意一个文件都应该可以用到
      // 因为我们把所有获取信息的逻辑封装到vuex中
      // 并把用户数据保存到vuex中
      // 整个项目中的任意一个文件都应该可以用到
      // 因为我们把所有获取信息的逻辑封装到vuex中
      // 并把用户数据保存到vuex中
      const res = await getUserInfo()
      // 获取用户头像信息
      const result = await getUserInfoById(res.userId)
      // 查看获取到的用户信息
      // console.log(res)
      // 把两个接口的数据合并在一起保存
      store.commit('setUserInfo', { ...res, ...result })
    },
    // 退出登录
    logout(store) {
      store.commit('removeToken')
      store.commit('removeUserInfo')
    }
  }
}

